﻿@{
    ViewBag.Title = "MergeClassConfig";
    Layout = "~/Views/Shared/_ScheduleClass_View.cshtml";
}

@using ClassModel
@using ClassCommon
@using ClassBLL

@{
    // 课程列表
    List<t_class_course> coursesList = ViewBag.courseList;  
}

@section headerPartial {
    <div class="modal fade" id="myModalUserInfo" tabindex="-1" role="dialog" aria-hidden="false" data-backdrop="static" data-keyboard="false">
        <div class="modal-dialog">
            <div class="modal-content" id="modal1">
                <div class="modal-header">
                    <button id="btnClose" type="button" class="close" data-dismiss="modal" style="display: none;">
                        ×
                   
                    </button>
                    <div class="modal-title">
                        <b>完善信息，免费获得排课秘籍</b>
                    </div>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="list_school_name" class="col-sm-2 control-label">*学校全称</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <div>
                                    <input id="list_school_name" type="text" class="form-control" placeholder="学校全称" aria-describedby="basic-addon1" maxlength="20"
                                        style="display: inline;">
                                </div>
                                <span id="inputError1" for="list_school_name" class="label label-danger" style="visibility: hidden">学校全称必填</span>
                            </div>
                            <br>
                            <br>
                            <label for="list_area" class="col-sm-2 control-label">*所在地区</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <link rel="stylesheet" href="/Static/Template/css/city-picker.css">
                                <script src="/Static/Template/js/city-picker.data.js"></script>
                                <script src="/Static/Template/js/city-picker.js"></script>
                                <div data-toggle="city-picker" class="form-control city-picker-input">
                                    <input id="list_area" readonly="" type="text">
                                </div>
                                <span class="city-picker-span" style="width: 1425px; height: 34px; line-height: 33px;">
                                    <span class="placeholder">请选择地区</span>
                                    <span class="title1" style="display: none;"></span>
                                    <div class="arrow"></div>
                                </span>
                                <div class="city-picker-dropdown" style="left: 0px; top: 100%; width: 1425px;">
                                    <div class="city-select-wrap">
                                        <div class="city-select-tab">
                                            <a class="active" data-count="province">省份</a>
                                            <a data-count="city">城市</a>
                                            <a data-count="district">区县</a>
                                        </div>
                                        <div class="city-select-content">
                                            <div class="city-select province" data-count="province" style="display: block;">
                                                <dl class="clearfix">
                                                    <dt>A-G</dt>
                                                    <dd>
                                                        <a title1="安徽省" data-code="340000" class="">安徽省</a>
                                                        <a title1="北京市" data-code="110000" class="">北京市</a>
                                                        <a title1="重庆市" data-code="500000" class="">重庆市</a>
                                                        <a title1="福建省" data-code="350000" class="">福建省</a>
                                                        <a title1="甘肃省" data-code="620000" class="">甘肃省</a>
                                                        <a title1="广东省" data-code="440000" class="">广东省</a>
                                                        <a title1="广西壮族自治区" data-code="450000" class="">广西壮族自治区</a>
                                                        <a title1="贵州省" data-code="520000" class="">贵州省</a>
                                                    </dd>
                                                </dl>
                                                <dl class="clearfix">
                                                    <dt>H-K</dt>
                                                    <dd>
                                                        <a title1="海南省" data-code="460000" class="">海南省</a>
                                                        <a title1="河北省" data-code="130000" class="">河北省</a>
                                                        <a title1="黑龙江省" data-code="230000" class="">黑龙江省</a>
                                                        <a title1="河南省" data-code="410000" class="">河南省</a>
                                                        <a title1="湖北省" data-code="420000" class="">湖北省</a>
                                                        <a title1="湖南省" data-code="430000" class="">湖南省</a>
                                                        <a title1="江苏省" data-code="320000" class="">江苏省</a>
                                                        <a title1="江西省" data-code="360000" class="">江西省</a>
                                                        <a title1="吉林省" data-code="220000" class="">吉林省</a>
                                                    </dd>
                                                </dl>
                                                <dl class="clearfix">
                                                    <dt>L-S</dt>
                                                    <dd>
                                                        <a title1="辽宁省" data-code="210000" class="">辽宁省</a>
                                                        <a title1="内蒙古自治区" data-code="150000" class="">内蒙古自治区</a>
                                                        <a title1="宁夏回族自治区" data-code="640000" class="">宁夏回族自治区</a>
                                                        <a title1="青海省" data-code="630000" class="">青海省</a>
                                                        <a title1="山东省" data-code="370000" class="">山东省</a>
                                                        <a title1="上海市" data-code="310000" class="">上海市</a>
                                                        <a title1="山西省" data-code="140000" class="">山西省</a>
                                                        <a title1="陕西省" data-code="610000" class="">陕西省</a>
                                                        <a title1="四川省" data-code="510000" class="">四川省</a>
                                                    </dd>
                                                </dl>
                                                <dl class="clearfix">
                                                    <dt>T-Z</dt>
                                                    <dd>
                                                        <a title1="天津市" data-code="120000" class="">天津市</a>
                                                        <a title1="新疆维吾尔自治区" data-code="650000" class="">新疆维吾尔自治区</a>
                                                        <a title1="西藏自治区" data-code="540000" class="">西藏自治区</a>
                                                        <a title1="云南省" data-code="530000" class="">云南省</a>
                                                        <a title1="浙江省" data-code="330000" class="">浙江省</a>
                                                    </dd>
                                                </dl>
                                            </div>
                                            <div class="city-select city" data-count="city" style="display: none;">
                                                <dl class="clearfix">
                                                    <dd></dd>
                                                </dl>
                                            </div>
                                            <div class="city-select district" data-count="district" style="display: none;">
                                                <dl class="clearfix">
                                                    <dd></dd>
                                                </dl>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <span id="inputError2" for="list_area" class="label label-danger" style="visibility: hidden">所在地区必填(省份、城市、区县)</span>
                            </div>
                            <br>
                            <br>
                            <label for="schoolType" class="col-sm-2 control-label">*学校类型</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <div>
                                    <select id="schoolType" class="form-control">
                                        <option value="-1" selected="selected">选择学校类型</option>
                                        <option value="0">小学</option>
                                        <option value="1">初中</option>
                                        <option value="2">高中</option>
                                        <option value="3">完全中学</option>
                                        <option value="4">大学</option>
                                        <option value="5">培训机构</option>
                                        <option value="6">竞品公司</option>
                                        <option value="7">其他</option>
                                    </select>
                                </div>
                                <span id="inputError6" for="schoolType" class="label label-danger" style="visibility: hidden">学校类型必选</span>
                            </div>
                            <br>
                            <br>
                            <hr style="width: 100%; height: 1px; float: left;">
                            <div>
                                <label for="list_job" class="col-sm-2 control-label">*您的职务</label>
                                <div class="col-sm-9" style="height: 55px; width: 165px;">
                                    <div>
                                        <select id="list_job" class="form-control">
                                            <option value="-1" selected="selected">选择您的职务</option>
                                            <option value="0">教务处负责人</option>
                                            <option value="1">信息负责人</option>
                                            <option value="2">年级主任</option>
                                            <option value="3">教学组长</option>
                                            <option value="4">理科教师</option>
                                            <option value="5">文科教师</option>
                                            <option value="6">教学副校长</option>
                                        </select>
                                    </div>
                                    <span id="inputError7" for="list_job" class="label label-danger" style="visibility: hidden">职务必选</span>
                                </div>
                                <label for="list_age" class="col-sm-2 control-label">*您的年龄</label>
                                <div class="col-sm-9" style="height: 55px; width: 165px;">
                                    <div>
                                        <select id="list_age" class="form-control">
                                            <option value="-1" selected="selected">选择您的年龄</option>
                                            <option value="0">20岁-25岁</option>
                                            <option value="1">25岁-30岁</option>
                                            <option value="2">30岁-35岁</option>
                                            <option value="3">35岁-40岁</option>
                                            <option value="4">40岁-45岁</option>
                                            <option value="5">45岁-50岁</option>
                                            <option value="6">50岁以上</option>
                                        </select>
                                    </div>
                                    <span id="inputError8" for="list_age" class="label label-danger" style="visibility: hidden">年龄必选</span>
                                </div>
                            </div>
                            <br>
                            <br>
                            <label for="list_phone" class="col-sm-2 control-label">*联系电话</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <div>
                                    <input id="list_phone" type="text" class="form-control" placeholder="联系电话" aria-describedby="basic-addon1" maxlength="11"
                                        style="display: inline;">
                                </div>
                                <span id="inputError3" for="list_phone" class="label label-danger" style="visibility: hidden">无效联系电话</span>
                            </div>
                            <br>
                            <br>
                            <label for="list_qq" class="col-sm-2 control-label">联系QQ</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <div>
                                    <input id="list_qq" type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" maxlength="20">
                                </div>
                                <span id="inputError4" for="list_qq" class="label label-danger" style="visibility: hidden">无效QQ号</span>
                            </div>
                            <br>
                            <br>
                            <label for="list_mail" class="col-sm-2 control-label">联系邮箱</label>
                            <div class="col-sm-9" style="height: 55px;">
                                <div>
                                    <input id="list_mail" type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" maxlength="100">
                                </div>
                                <span id="inputError5" for="list_mail" class="label label-danger" style="visibility: hidden">无效联系邮箱</span>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <!--<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>-->
                    <button id="btn_save_user_Info" type="button" class="btn btn-primary" onclick="userInfoEditor.inputUserInfo()">确定</button>
                </div>
            </div>
        </div>
        <input type="hidden" id="oldProvince">
        <input type="hidden" id="oldCity">
        <input type="hidden" id="oldDistrict">
    </div>
    <script>
        var userInfoEditor = new UserInfoEditor();
        $('#myModalUserInfo').on('show.bs.modal', function (e) {

            $(this).find('.modal-dialog').css({
                'margin-top': function () {
                    $("#inputError1").css({ 'visibility': 'hidden' });
                    $("#inputError2").css({ 'visibility': 'hidden' });
                    $("#inputError3").css({ 'visibility': 'hidden' });
                    $("#inputError4").css({ 'visibility': 'hidden' });
                    $("#inputError5").css({ 'visibility': 'hidden' });
                    $("#inputError6").css({ 'visibility': 'hidden' });
                    $("#inputError7").css({ 'visibility': 'hidden' });
                    $("#inputError8").css({ 'visibility': 'hidden' });
                    jQuery.ajax({
                        type: "GET",
                        url: "/m/userInfo/getUserInfo",
                        cache: false,
                        success: function (ret) {
                            var info = JSON.parse(ret);
                            $(".city-picker-span").css("width", "100%");
                            $(".city-picker-dropdown").css("width", "100%");
                            if (info.area != null && info.area != "" && info.area != undefined) {
                                $("#list_age").val(info.area);
                                var areaArray = info.area.split("-");

                                if (areaArray.length >= 3) {
                                    $("span .placeholder").css("display", "none");
                                    $("span .title1").css("display", "");
                                    $("span .title1").empty();
                                    $("#oldProvince").val(areaArray[0]);
                                    $("#oldCity").val(areaArray[1]);
                                    $("#oldDistrict").val(areaArray[2]);
                                    $("span .title1").append("<span class='select-item' data-count='province'>" + areaArray[0] + "</span>-");
                                    $("span .title1").append("<span class='select-item' data-count='city'>" + areaArray[1] + "</span>-");
                                    $("span .title1").append("<span class='select-item' data-count='district'>" + areaArray[2] + "</span>");
                                } else if (areaArray.length >= 2) {
                                    $("span .title1").empty();
                                    $("span .placeholder").css("display", "none");
                                    $("#oldProvince").val(areaArray[0]);
                                    $("#oldCity").val(areaArray[1]);
                                    $("span .title1").append("<span class='select-item' data-count='province'>" + areaArray[0] + "</span>-");
                                    $("span .title1").append("<span class='select-item' data-count='city'>" + areaArray[1] + "</span>");
                                } else if (areaArray.length >= 1) {
                                    $("span .title1").empty();
                                    $("#oldProvince").val(areaArray[0]);
                                    $("span .placeholder").css("display", "none");
                                    $("span .title1").append("<span class='select-item' data-count='province'>" + areaArray[0] + "</span>");
                                }
                                $("#btnClose").removeAttr("style");
                            }
                            if (info.schoolName != null && info.schoolName != "" && info.schoolName != undefined) {
                                $("#list_school_name").val(info.schoolName);
                            }
                            if (info.phone != null && info.phone != "" && info.phone != undefined) {
                                $("#list_phone").val(info.phone);
                            }
                            if (info.qqNumber != null && info.qqNumber != "" && info.qqNumber != undefined) {
                                $("#list_qq").val(info.qqNumber);
                            }
                            if (info.userEmail != null && info.userEmail != "" && info.userEmail != undefined) {
                                $("#list_mail").val(info.userEmail);
                            }
                            if (info.ageArrange != null && info.ageArrange != undefined && info.ageArrange.toString() != "") {
                                $("#list_age").val(info.ageArrange);
                            }
                            if (info.jobType != null && info.jobType != undefined && info.jobType.toString() != "") {
                                $("#list_job").val(info.jobType);
                            }
                            if (info.schoolType != null && info.schoolType != undefined && info.schoolType.toString() != "") {
                                $("#schoolType").val(info.schoolType);
                            }
                        }
                    });
                    $("#list_school_name").focus(function () {
                        $("#inputError1").css({ 'visibility': 'hidden' });
                    });
                    $("#list_area").focus(function () {
                        $("#inputError2").css({ 'visibility': 'hidden' });
                    });
                    $("#list_phone").focus(function () {
                        $("#inputError3").css({ 'visibility': 'hidden' });
                    });
                    $("#list_qq").focus(function () {
                        $("#inputError4").css({ 'visibility': 'hidden' });
                    });
                    $("#list_mail").focus(function () {
                        $("#inputError5").css({ 'visibility': 'hidden' });
                    });
                    $("#schoolType").change(function () {
                        $("#inputError6").css({ 'visibility': 'hidden' });
                    });
                    $("#list_job").change(function () {
                        $("#inputError7").css({ 'visibility': 'hidden' });
                    });
                    $("#list_age").change(function () {
                        $("#inputError8").css({ 'visibility': 'hidden' });
                    });
                    var modalHeight = 580; // $('#myModal').find('.modal-dialog').height();
                    return ($(window).height() / 2 - (modalHeight / 2));
                }
            });
        });
    </script>
    <link href="/Static/Template/css/mergedClass.css" rel="stylesheet">
    <link href="/Static/Template/css/step-box.css" rel="stylesheet">

    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "//hm.baidu.com/hm.js?7c66c07d4e8cc54deba8d7f967efe75b";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
        $(document).ready(function () {
            updateSchoolView();
        });
        function loadInputTable() {
            if (userInfoEditor) {
                userInfoEditor.showUserInfoInput();
            }
        }

        function updateSchoolView() {
            var schoolLabel = $("#label_school_name");
            jQuery.ajax({
                type: "GET",
                url: "/m/userInfo/getSchoolName",
                cache: false,
                success: function (ret) {
                    var userInfoButton = $("#btn_add_userInfo");
                    userInfoButton.css({ 'visibility': 'visible' });
                    if (ret.split(",")[0] == "") {
                        //从未填写过学校信息
                        userInfoButton.text("添加");
                        $("#btn_add_task").attr('disabled', true);
                        $("#btn_add_task_first").attr('disabled', true);
                        schoolLabel.text("学校: 未填写");
                        loadInputTable();
                    } else {
                        userInfoButton.text("修改");
                        $("#btn_add_task").attr('disabled', false);
                        $("#btn_add_task_first").attr('disabled', false);
                        schoolLabel.text("学校: " + ret.split(",")[0]);
                        if (ret.split(",")[1] == "") {
                            loadInputTable();
                        }
                    }
                    schoolLabel.css({ 'visibility': 'visible' });
                }
            });
        }
    </script>
}


<div id="divbody" style="min-height: 495px;">
    <div class="container" id="divcon">
        <style>
            a.view-course-plan {
                padding-left: 25px;
                background-repeat: no-repeat;
                margin-left: 10px;
                text-decoration: none;
                padding-bottom: 5px;
            }



            li.pos {
                margin-left: 15px;
            }

            .list-inline a {
                text-decoration: none;
                padding-left: 25px;
                padding-bottom: 5px;
            }
        </style>
        <div class="row" style="margin-top: 20px;">
            <div class="col-md-8">
                <ul class="list-inline">
                    <li>
                        <a href="OperatorClassDetail?id=7BF56BD9A6AFEA21" id="baseInfo" class="task-baseInfo">基础信息</a>
                    </li>
                    <li class="pos">
                        <a href="javascript:void()" id="rule" onclick="goUrl('/m/rule/unScheduleRule?taskId=2640188197994496')" class="task-rule active task-rule-active">规则条件</a>
                    </li>

                    <li class="pos">
                        <a href="javascript:void()" id="auto" class="task-auto">自动排课</a>
                    </li>
                    <li class="pos" show-by-courseplan="1" style="display: none;">
                        <a id="adjust" class="task-adjust" href="http://paike.yunxiao.com/m/adjustTeaCoursePlan/teaTimeTable?taskId=2640188197994496#c">调课</a>
                    </li>
                    <li class="pos" show-by-courseplan="1" style="display: none;">
                        <a href="http://paike.yunxiao.com/m/courseplan/class?taskId=2640188197994496" id="task-coursePlan" class="task-coursePlan">查看课表</a>
                    </li>

                </ul>
            </div>

            <div class="col-md-2 col-md-offset-2">
                <div class="dropdown" style="float: right;">
                    <button id="btnQuestions" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-default dropdown-toggle">
                        排课遇到难题
                        <span class="caret"></span>
                    </button>
                    <ul id="questions-list" class="dropdown-menu dropdown-menu-right" aria-labelledby="btnQuestions">
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3738&amp;extra=page%3D1" target="_blank">任课老师变化之后规则条件要重新设置吗？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3729&amp;extra=page%3D1" target="_blank">希望任课教师的课时分布平均一些，如何设置？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3731&amp;extra=page%3D1" target="_blank">规则条件里的“其它”可以自己添加吗？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3730&amp;extra=page%3D1" target="_blank">什么时候要用到“合班”？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3737&amp;extra=page%3D1%26filter%3Dtypeid%26typeid%3D9"
                                target="_blank">不排课时间较多的时候，操作太麻烦怎么办？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3347&amp;fromuid=26" target="_blank">“添加标签”有什么作用？</a>
                        </li>
                        <li>
                            <a href="http://bbs.yunxiao.com/forum.php?mod=viewthread&amp;tid=3728&amp;extra=page%3D1" target="_blank">不排课时间怎么设置？</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <script src="/Static/Template/js/course-plan.js" charset="utf-8"></script>
        <script>
            var coursePlanService = new CoursePlanService();
            var hasCoursePlan = 0;
            $(function () {
                initButton();
            })
            function initButton() {
                coursePlanService.hasCoursePlan(taskId, function (has) {
                    hasCoursePlan = has;
                    $("li[show-by-courseplan='1']").hide();
                    if (has == "1") {
                        $("li[show-by-courseplan='1']").show();
                    }
                })
            }
        </script>

        <script>
            function fillQuestion(list) {
                var html = new Array();
                for (var i = 0; i < list.length; i++) {
                    html.push("<li><a href='" + list[i].text + "' target='_blank'>" + list[i].title + "</a></li>");
                }
                $("#questions-list").html(html.join(""));
            }

            function getContentList(sign) {
                jQuery.ajax({
                    url: "/m/content?sign=" + sign,
                    type: "GET",
                    success: function (ret) {
                        if (ret) {
                            fillQuestion(ret);
                        } else {
                            $("#questions-list").html("<li><a href='http://bbs.yunxiao.com/forum.php?mod=forumdisplay&fid=36'" +
                                " target='_blank'>暂时没有内容，前往论坛</a></li>");
                        }
                    }
                })
            }
        </script>
        <div class="row">
            <div class="col-md-8" style="padding-top: 10px;">
                请将优先考虑的教师、课程预排入课程表中，云校排课会优先满足这些要求
            </div>
            <div class="col-md-4 text-right">
            </div>
        </div>
        <div style="margin-top: 10px; border-top: 1px solid #0599f7"></div>
        <style type="text/css">
            .my-list-inline {
                padding-left: 0;
                list-style: none;
                border-bottom: 1px solid #b3b3b3;
                display: inline-block;
            }

                .my-list-inline > li {
                    display: inline-block;
                    width: 104px;
                    text-align: center;
                    margin-left: -4px;
                    cursor: pointer;
                }

                    .my-list-inline > li:first-child {
                        margin-left: 0px;
                    }

                .my-list-inline .active {
                    color: #ec5d41;
                    border-bottom: 4px solid #ec5d41;
                    cursor: default;
                }

                .my-list-inline a {
                    color: #666666;
                    font-size: 13px;
                    text-decoration: none;
                }

            a.colorful {
                color: #ec5d41;
            }

            a.view-unSchedule-rule {
                text-decoration: none;
            }
        </style>
        <!-- 横向菜单 -->
        <div class="row" style="margin-top: 20px;">
            <div class="col-md-8">
                <ul class="my-list-inline">
                    <li id="task-rule-unScheduleTime">
                        <a href="RuleIndex?taskid=@(ViewBag.RawTaskId)">不排课时间</a>
                    </li>
                    <li id="task-rule-mergedClasses" class="active">
                        <a href="javascript:void(0);" class="colorful">合班</a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="row" style="margin-top: 10px;">
            <div class="col-md-3 box">
                <div class="list-group list-group-outer">
                    <a href="javascript:void(0)" class="list-group-item active list-group-item-header" style="background-color: #FFFFFF; color: #ec5d41">第一步：选择课程</a>

                    <div class="list-group list-group-body" id="dxns-div-course">
                        @if (coursesList != null)
                        {
                            for (int c = 0, count = coursesList.Count; c < count; c++)
                            {
                            <!-- 第一步，课程选择循环HTML (这个是单选) --> 
                            <a href="javascript:void(0)" class="list-group-item" data-courseid="@(coursesList[c].id)">@(coursesList[c].coursename)</a>
                            }
                        }

                    </div>
                </div>
            </div>
            <div class="col-md-1 arrow-col" style="background: url(/static/img/arrow.png) no-repeat center center">
            </div>
            <div class="col-md-3 box">
                <div class="list-group list-group-outer">
                    <a href="javascript:void(0)" class="list-group-item active list-group-item-header" style="background-color: #FFFFFF; color: #ec5d41">第二步：勾选班级(合班务必选择相同的老师，否则回导致排课失败!)</a>
                    <div class="list-group list-group-body" id="dxns-div-class">
                        <!-- 第二步，班级勾选循环HTML (这个可以多选) -->
                    </div>
                </div>
            </div>
            <div class="col-md-1 arrow-col" style="background: url(/static/img/arrow.png) no-repeat center center">
            </div>
            <div class="col-md-3 box">
                <div class="list-group list-group-outer" style="text-align: center">
                    <div class="tips-box">
                        <div class="alert alert-success" style="display: none;" id="tips">提示信息！</div>
                    </div>
                    <button type="button" class="btn btn-primary btn1" id="btn-merge">合班 &gt;&gt;</button>
                    <button type="button" class="btn btn-default btn1" id="dxns-btn-remove">&lt;&lt; 取消合班</button>
                </div>
            </div>
            <div class="col-md-1 arrow-col" style="background: url(/static/img/arrow.png) no-repeat center center">
            </div>
            <div class="col-md-3 box box1">
                <div class="list-group list-group-outer">
                    <a href="javascript:void(0)" class="list-group-item active list-group-item-header" style="background-color: #FFFFFF; color: #ec5d41; text-align: center">已存在合班课</a>

                    <div class="list-group list-group-body" id="dxns-div-mergedclass">
                    </div>
                </div>
            </div>
        </div>
        <!---->
        <div id="stepArea" style="height: 70px;">
            <div id="stepBox" class="text-right stepBoxFixed2" style="bottom: 0px;">
                @* <button type="button" class="btn btn-info btn-sm btn-step" onclick="goUrl(&#39;/m/rule/doubleLessonRule?taskId=2640188197994496&#39;)">
                    上一步
                </button>*@
                <button type="button" class="btn btn-info btn-sm btn-step" style="width: 220px" onclick="window.location.href='BeginSchedule?taskid=@(ViewBag.RawTaskId)'">
                    合班完毕，开始排课
                </button>
            </div>
        </div>

        <link href="/Static/Template/css/ruleDialog.css" rel="stylesheet">
        <style>
            #ruleListTable_body td {
                padding: 8px;
                font-size: 14.8px;
                text-align: left;
            }
        </style>
        <!--规则列表 Modal -->
        <div class="modal fade modal-ruleList" id="ruleListModal" tabindex="-1" role="dialog" aria-labelledby="ruleListModalLabel"
            aria-hidden="false">
            <div class="modal-dialog" style="width: 900px">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                        </button>
                        <div class="modal-title" id="ruleListModalLabel">
                            <b>规则列表</b>
                        </div>
                        <div style="margin-top: 10px;">
                            <select id="unScheduleRuleListTypeSlt" onchange="ruleViewer.getRuleList()" class="form-control" style="margin-bottom: 10px; width: 200px;">
                                <option value="all" selected="">所有规则</option>
                                <option value="unschedule_grade">年级不排课</option>
                                <option value="unschedule_class">班级不排课</option>
                                <option value="unschedule_course">课程不排课</option>
                                <option value="unschedule_course_grade">年级课程不排课</option>
                                <option value="unschedule_teacher">教师不排课</option>
                                <option value="preschedule">预排</option>
                                <option value="importance_japq">教案平齐</option>
                                <option value="importance_zrkfb">周任课分布</option>
                                <option value="importance_rrkfb">日任课分布</option>
                                <option value="importance_lsxz">连上限制</option>
                            </select>
                            <span id="ruleStatistics"></span>
                        </div>
                    </div>
                    <div class="modal-body">
                        <table class="table table-striped table-bordered">
                            <thead>
                                <tr>
                                    <td width="130">规则</td>
                                    <td>细则</td>
                                    <td style="width: 100px">重要性</td>
                                    <td width="50">操作</td>
                                </tr>
                            </thead>
                            <tbody id="ruleListTable_body">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <input type="hidden" id="dxns_fileid" value="@(ViewBag.fileid)" />
        <input type="hidden" id="dxns_taskid" value="@(ViewBag.RawTaskId)" />
        <script src="/Static/Template/js/rule-statistic.js" charset="UTF-8"></script>
        <script src="/Static/Template/js/rule-view.js" charset="UTF-8"></script>
        <script>
            var _hmt = _hmt || [];
            (function () {
                var hm = document.createElement("script");
                hm.src = "https://hm.baidu.com/hm.js?7c66c07d4e8cc54deba8d7f967efe75b";
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(hm, s);
            })();
        </script>
        <script>
            var ruleViewer = new RuleViewer();
        </script>
        <script>
            var isMyTask = true
        </script>
        <script>
            ruleViewer.setTaskId('2640188197994496')
        </script>

        <script>
            var taskId = 2640188197994496;
            $(function () {
                // 1st leve step
                setTaskStep("rule");
                // 2nd level step
                setTaskRuleStep("task-rule-mergedClasses");
            })
        </script>

        <script type="text/javascript" src="/Static/Template/js/ruleUtil.js"></script>
        <script type="text/javascript" src="/Static/Template/js/ruleMergedClass1.js"></script>
        <script type="text/javascript" src="/Static/Template/js/step-box.js"></script>
        <script>
            stepBox.init();
        </script>

    </div>
</div>

@section scripts {
    <script type="text/javascript">

        var fileid = $("#dxns_fileid").val();
        var taskid = $("#dxns_taskid").val();

        /// 需要插入和班级相关老师和课程数据
        var $teacherClassContainer = $("#dxns-div-class");

        /// 合班容器
        var $mergeClassContainer = $("#dxns-div-mergedclass");

        // 预加载合班信息
        (function () {
            /*
                <a href="javascript:void(0)" class="list-group-item" data-courseid="5" data-classcount="2" data-classids="3,4">劳技：苟明远,苟明远(3班,4班)</a>
            */

            $.get("GetMergeInfoWithTaskId", { taskid: taskid }, function (data) {
                if (data.mergeList.length > 0) {
                    // 一条就是一个合班数据
                    data.mergeList.forEach(function (merge, index) {
                        var classids = merge.classIds; //课程的id
                        var teacherids = merge.teacherIds; // 老师的id
                        var classCount = merge.classCount;

                        //老师名字、班级名字
                        // ajax 同步请求

                        var teacherNames;
                        $.ajax({
                            url: "GetTeachersInfoWithTeacherIds",
                            data: { teacherIds: teacherids },
                            type: "GET",
                            async: false,
                            dataType: "json",
                            success: function (data) {
                                teacherNames = data.result;
                            }
                        });

                        var classNames;
                        $.ajax({
                            url: "GetClassInfoWithClassIds",
                            data: { classIds: classids },
                            type: "GET",
                            async: false,
                            dataType: "json",
                            success: function (data) {
                                classNames = data.result;
                            }
                        });


                        var mergeHTML2 = "<a href='javascript:void(0)' data-id='" + merge.id + "' class='list-group-item' data-courseid='" + merge.courseid + "' data-classcount='" + classCount + "' data-classids='" + classids + "'>" + merge.courseName + "：" + teacherNames + "(" + classNames + ")</a>";

                        $mergeClassContainer.append(mergeHTML2);



                        // 绑定事件
                        splitMerge();
                    });
                }
            })
        })()


        // 课程的a标签点击
        $("#dxns-div-course a").on("click", function () {
            var $this = $(this);
            $this.addClass("selected");
            $this.siblings().removeClass("selected");
            // 根据当前的courseid，获取老师信息
            $.get("GetTeacherClassInfo", {
                courseid: $this.attr("data-courseid"),
                fileid: fileid
            }, function (data) {
                if (data.status) {
                    /*<a class="list-group-item" classid="2645732200890369" teacherid="2645732200890385" groupid="0">高二1班(裔春蕾)</a>*/
                    var html = "";
                    for (var i = 0; i < data.list.length; i++) {
                        html += "<a class='list-group-item' data-classid='"
                            + data.list[i].classid + "' data-teacherid='"
                            + data.list[i].teacherid + "' data-courseid='"
                            + data.list[i].courseid + "' data-coursename='"
                            + data.list[i].courseName + "' data-classname='"
                            + data.list[i].className + "' data-grade='"
                            + data.grade + data.list[i].className + "' data-teacherName='"
                            + data.list[i].teacherName + "'>"
                            + data.grade + ""
                            + data.list[i].className
                            + "(" + data.list[i].teacherName + ")</a>";
                    }

                    $teacherClassContainer.html(html);

                    // 绑定单击事件
                    bindTC();
                } else {
                    alert("数据请求失败!");
                }
            });
        });

        // 老师、班级可以多选
        function bindTC() {
            $("#dxns-div-class a").on("click", function () {
                var $this = $(this);
                $this.toggleClass("selected");
            });
        }

        // 点击合班
        $("#btn-merge").on("click", function () {
            var itemList = [];
            $teacherClassContainer.find("a").each(function (index, item) {
                var $item = $(item);
                if ($item.hasClass("selected")) {
                    itemList.push($item);
                    //$mergeClassContainer.append($item);
                    //$teacherCourseContainer.remove($item);
                    $item.removeClass("selected");
                }
            })

            if (itemList.length == 0) { alert("请选择需要合班的课程和班级!"); return; }

            // 班级个数
            var classCount = itemList.length;
            // 课程名称
            var courseName = $(itemList[0]).attr("data-coursename");
            // 课程id
            var courseid = $(itemList[0]).attr("data-courseid");
            // 合班的老师姓名
            var teacherNames = "";
            var teacherids = ""; // 合班的老师id
            // 合班的班级姓名
            var classNames = "";
            var classids = ""; // 合班的班级id

            itemList.forEach(function (item, index) {
                teacherNames += $(item).attr("data-teachername") + ",";
                teacherids += $(item).attr("data-teacherid") + ",";
                classNames += $(item).attr("data-classname") + ",";
                classids += $(item).attr("data-classid") + ",";
            });

            // 格式整理
            teacherNames = teacherNames.substring(0, teacherNames.length - 1);
            teacherids = teacherids.substring(0, teacherids.length - 1);
            classNames = classNames.substring(0, classNames.length - 1);
            classids = classids.substring(0, classids.length - 1);

            /*
            <a href="javascript:void(0)" class="list-group-item" data-courseid="5" data-classcount="2" data-classids="3,4">劳技：苟明远,苟明远(3班,4班)</a>
            */

            // 合班的HTML拼接
            var mergeHTML = " <a href='javascript:void(0)' class='list-group-item' data-courseid='" + courseid + "' data-classCount='" + classCount + "' data-classids='" + classids + "'>" + courseName + "：" + teacherNames + "(" + classNames + ")</a>";
            $mergeClassContainer.append(mergeHTML); // 将凭借好的HTML插入合班容器。

            itemList.forEach(function (item, index) {
                console.log(typeof item + ' index :' + index);
                // $teacherClassContainer.remove($(item)); 
                $(item).remove(); // 直接用元素的remove方法删除自己即可
            });

            // 绑定事件
            splitMerge();

            // 需要把合班信息存入到数据库 ajax请求 (fileid,or taskid)
            /* courseid(课程id) classCount(合班的班级个数) 1，2，3 分别是班级编号  */

            $.post("SaveMergeInfo", {
                courseid: courseid,
                classCount: classCount,
                classids: classids,
                taskid: taskid,
                teacherids: teacherids
            },
            function (data) {
                if (data.status) {
                    $mergeClassContainer.find("a:last").attr("data-id", data.status); // 绑定id信息

                    alert("合班信息保存成功!");
                } else {
                    alert("合班信息已经存在，无需重复保存!");
                }
            });
        })


        function splitMerge() {
            $("#dxns-div-mergedclass a").unbind("click");
            // 拆分合班
            $("#dxns-div-mergedclass a").on("click", function () {
                var $this = $(this);
                $this.addClass("selected");
                $this.siblings().removeClass("selected");
            });
        }

        // 拆分合班
        $("#dxns-btn-remove").on("click", function () {
            if (!$("#dxns-div-mergedclass a").hasClass("selected")) {
                alert("请选择一个需要拆分的合班选项!");
                return;
            }

            $("#dxns-div-mergedclass a").each(function (index, item) {
                var $item = $(item);
                console.log($item);
                if ($item.hasClass("selected")) {
                    $.get("DeleteMergeInfo", { id: $(item).attr("data-id"), taskid: taskid }, function (data) {
                        if (data.status) {
                            $item.remove();
                        }
                    })
                }
            });
        });

    </script>
}
